
<include file="public@header"/>
<hook name="admin_before_head_end"/>
<body>
<style>
body{
background-color:#e5f3e6;
}
.col-md-8 td div{
text-align:center;
display:inline-block;
width:50px;
background-color:#fff;
color:#000;
}
.col-md-8{
padding:8px;
margin:0;
/*div 加阴影*/
 filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);
   -moz-box-shadow: 2px 2px 10px #909090;

   -webkit-box-shadow: 2px 2px 10px #909090;

   box-shadow:2px 2px 10px #909090;
}
.col-md-8 ul{
margin:5px 0;
min-width: 1050px;
}
.col-md-8 li span{
vertical-align:middle;
}
.col-md-8 li{
margin:10px 10px;
font-size:15px;
}
.col-md-8 table caption{
background-color:#fff;
padding-left:32px;
color:#000;
font-size:18px;
}
.col-md-8 table{
background-color:rgba(229,,243,230,0.5);
background-color:#fff;
color:#737373;
font-size:18px;
text-align:center;

margin-bottom: 0px;

}
.col-md-8 table th{
text-align:center;

}
.companyName{
	text-align:center;
	font-size:36px;
	margin:24px 0px;
	/*加倒影*/
	-webkit-box-reflect: below 2px -webkit-gradient(linear,left top,left bottom, from(rgba(0,0,0,0)),to(rgba(255,255,255,0.3)));
	/*div 加阴影*/
	 filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);
	   -moz-text-shadow: 2px 2px 10px #909090;
	   -webkit-text-shadow: 2px 2px 10px #909090;
	   text-shadow:5px 5px 10px #909090;
	 font-family: '微软雅黑';
	}
.row1div1{
background-color:#fff;
/*div 加阴影*/
 filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);
   -moz-box-shadow: 2px 2px 10px #909090;

   -webkit-box-shadow: 2px 2px 10px #909090;

   box-shadow:2px 2px 10px #909090;
}
.row1div1 h4{
margin: 0;
padding:16px;
}
small a{
color:#000;

}
small a:hover{
text-decoration: none;
cursor:pointer;
}
.page-header{
margin-top:0px;
}
.col-md-4{
padding:0px 8px 0px 8px;

}
.row{
margin:0px;
}
</style>
<div class="row">
	<div class="col-md-4">
		<h5 class="companyName">{$comanyName}</h5>
	</div>
	<div class="col-md-8">
		<table class="table" style="color: #fff;">
			<tr style="background-color: #037742;text-align: left;">
				<td><span class="glyphicon glyphicon-exclamation-sign"></span> 风险点统计</td>
				<td>风险点总数 <div style="background-color:#a5d8b2">400</div></td>
				<td>Ⅰ级风险点 <div style="background-color:#db2a1f">124</div></td>
				<td>Ⅱ级风险点 <div style="background-color:#f18605">24</div></td>
				<td>Ⅲ级风险点 <div style="background-color:#fdf016">224</div></td>
				<td>Ⅳ级风险点 <div style="background-color:#34318b;color:#fff">4</div></td>
			</tr>
			<tr style="background-color: #61a579;text-align: left;">
				<td style="color:#fff"><span class="glyphicon glyphicon-exclamation-sign"></span> 隐患统计 </td>
				<td>隐患总数量 <div>455</div></td>
				<td>已上报数量 <div>153</div></td>
				<td>待整改数量 <div>422</div></td>
				<td>待复查数量 <div>255</div></td>
				<td>已完成数量 <div>65</div></td>
			</tr>
		</table>
	</div>
</div>
	<div class="row">
	<!-- 左侧1/4列容器 -->
	<div class="col-md-4">
			<div class="row1div1 page-header" style="height: 300px;padding-bottom: 0px">
				<h4 style="background-color: #fff">安全风险四色图<small class="pull-right"><a>详情</a></small></h4>
				<img usemap="#map" src="__STATIC__/images/gs.jpg" style="height: 99%;width: 100%" 
				 id="monitor_map" />   
				<map id="map" name="map">
					<foreach name="mapdata" item="vo">
						<area id="{$vo.dangerAreaID}"onclick="areadataajax(this)" shape="poly" data="{$vo.dangerAreaCoordinate}"coords="" alt="{$vo.dangerAreaName}" />
					</foreach>
				</map>
			</div>
	</div>
	<!-- 右侧3/4列容器 -->
	<div class="col-md-8">
		<table  class="table" style="height: 300px;font-size: 15px;">
		<caption><b>工作提醒</b></caption>
			<thead>
				<th style="width:8%">序号</th>
				<th>信息内容</th>
				<th style="width:20%">发布日期</th>
			</thead>
			<tr>
				<td>1</td>
				<td>暂无</td>
				<td>2019/11/8</td>
			</tr>
			<tr>
				<td>2</td>
				<td>暂无</td>
				<td>2019/11/8</td>
			</tr>
			<tr>
				<td>3</td>
				<td>暂无</td>
				<td>2019/11/8</td>
			</tr>
			<tr>
				<td>4</td>
				<td>暂无</td>
				<td>2019/11/8</td>
			</tr>
			<tr>
				<td>5</td>
				<td>暂无</td>
				<td>2019/11/8</td>
			</tr>
		</table>
<!-- 职责确认弹出 -->
	</div>
</div>
<!-- charts -->
<div class="row divcharts">
	<div class="col-md-4">
		<div class="row1div1 page-header">
		<h4>各部门风险未巡查周统计<small class="pull-right"><a>详情</a></small></h4>
		<!--各部门风险未巡查周统计 折线-->
		<div id = "unpartolView"  style="height:315px;"></div>
		</div>
	</div>
	<div class="col-md-4">
		<div class="row1div1 page-header">
		<h4>隐患数量周统计<small class="pull-right"><a>详情</a></small></h4>
		<!--隐患数量周统计 柱状图-->
		<div  id = "hidenView" style="height:315px;"></div>
		</div>
	</div>
	<div class="col-md-4">
		<div class="row1div1 page-header">
		<h4>隐患状态统计<small class="pull-right"><a>详情</a></small></h4>
		<!--隐患状态统计 饼图-->
		<div  id = "hidenStatusView" style="height:315px;"></div>	
		</div>
	</div>
	<div class="col-md-4">
		<div class="row1div1 page-header" style="margin-top: -8px;">
		<h4>各部门隐患上报周统计<small class="pull-right"><a>详情</a></small></h4>
		<!--各部门隐患上报周统计 折线图-->
		<div  id = "hidensendView" style="height:315px;"></div>
		</div>
	</div>
	<div class="col-md-4">
		<div class="row1div1 page-header"  style="margin-top: -8px;">
		<h4>隐患排查方式周统计<small class="pull-right"><a>详情</a></small></h4>
		<!--隐患排查方式周统计 柱状图-->
		<div id = "hidenTypeView" style="height:315px;"></div>
		</div>
	</div>
	<div class="col-md-4">
		<div class="row1div1 page-header"  style="margin-top: -8px;">
		<h4>各部门隐患整改率统计<small class="pull-right"><a>详情</a></small></h4>
		<!--隐患整改率统计 饼图-->
		<div id = "reformView" style="height:315px;"></div>
		</div>		
	</div>
</div>
<div id="myModal2" data-backdrop="static" class="modal fade" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">职责确认</h4>
      </div>
      <div class="modal-body">
		<form class="js-ajax-form margin-top-20"  action="{:url('admin/main/dutypost')}" method="post">
			<div class="table_full">
				<table class="table table-bordered" id="authrule-tree">
					<tbody>
						{$category}
					</tbody>
				</table>
			</div>
			<!-- <div class="form-actions"> -->
				<!-- <button class="btn btn-primary js-ajax-submit" type="submit">{:lang('SAVE')}</button> -->
				<!-- <a class="btn btn-default" href="{:url('admin/rbac/index')}">{:lang('BACK')}</a> -->
			<!-- </div> -->

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="submit" class="btn btn-primary">保存</button>
      </div>
	 </form>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<div id="myModal1" data-backdrop="static" class="modal fade" tabindex="-1" role="dialog">
                        <div class="modal-dialog modal-lg" style="width: 100%;height:600px;overflow:auto;" >
                            <div class="modal-content"   >
                                <div class="modal-header">
                                    <button type="button" class="close" 
                                    data-dismiss="modal" aria-hidden="true">&times;</button>
                                    <h4 class="modal-title" id="myModalLabel">岗位风险信息</h4>
                                </div>
                                <div class="modal-body"  >

                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" 
                                        class="btn btn-default" 
                                        data-dismiss="modal">关闭</button>
                                    </div>
                                </div><!-- /.modal-content -->
                            </div><!-- /.modal -->
</div><!-- /.modal -->
<script src="__STATIC__/js/admin.js"></script>
<php>
    $lang_set=defined('LANG_SET')?LANG_SET:'';
    $thinkcmf_version=defined('THINKCMF_VERSION')?THINKCMF_VERSION:'';
</php>
<script src="__STATIC__/js/echarts/echarts.min.js"></script>
<script>
function areadataajax(a){
var id= a.id;
<!-- console.log(id); -->
$('#myModal1 .modal-body').empty();
$.ajax({
            url:"/index.php/admin/main/dangerShow",
            data:{id:id},
            type:"post",
            dataType:"json",
            success: function(data){
				var rdata = JSON.parse(data);
				console.log(rdata);
			for(var j=0;j<rdata.length;j++){
			var divstr="<div id='tablediv"+j+"'><table class='table1'></table><table class='table2'></table></div>";
			$('#myModal1 .modal-body').append(divstr);
			var dividstr1="#tablediv"+j+" .table1";
			var dividstr2="#tablediv"+j+" .table2";
			$(dividstr1).append("<thead><tr><th>所属单位</th><th>管控区域</th><th>区域负责人</th><th>风险级别</th></tr></thead><tbody><tr><td>"+rdata[0]['name']+
			"</td><td>"+rdata[j]['workArea']+
			"</td><td>"+rdata[j]['stationPerson']+
			"</td><td class='level'>"+rdata[j]['stationdangerLevel']+"</td></tr></tbody>");
			$(dividstr2).append("<thead><tr><th>序号</th><th>危害因素</th><th>事故类型</th><th>控制措施</th><th>风险级别</th></tr></thead>");
					for(var i=0;i<rdata[j]['data'].length;i++){
					$(dividstr2).append(
					"<tbody><tr><td>"+(i+1)+
					"</td><td>"+rdata[j]['data'][i]['dangerInfo']+
					"</td><td>"+rdata[j]['data'][i]['accidentStand']+
					"</td><td>"+rdata[j]['data'][i]['accidentMeasures']+
					"</td><td class='level'>"+rdata[j]['data'][i]['dangerLevel']+"</td></tr></tbody>");
					}
			}
			$('.level').each(function(){
			 if ($(this).text()=='Ⅰ') $(this).css('background-color','#FF0000');
			 if ($(this).text()=='Ⅱ') $(this).css('background-color','#F08519');
			 if ($(this).text()=='Ⅲ') $(this).css('background-color','#FFFF00');
			 if ($(this).text()=='Ⅳ') $(this).css('background-color','#00A2E9');
			});
            }
			
        });
$('#myModal1').modal('show');			
}
//职责确认模态框内容控制
<!-- $('#myModal2').modal('show');  -->
$(document).ready(function () {
		Wind.css('treeTable');
	    Wind.use('treeTable', function () {
	        $("#authrule-tree").treeTable({
	            indent: 20
	        });
	    });
	});

    function checknode(obj) {
        var chk = $("input[type='checkbox']");
        var count = chk.length;

        var num = chk.index(obj);
        var level_top = level_bottom = chk.eq(num).attr('level');
        for (var i = num; i >= 0; i--) {
            var le = chk.eq(i).attr('level');
            if (le <level_top) {
                chk.eq(i).prop("checked", true);
                var level_top = level_top - 1;
            }
        }
        for (var j = num + 1; j < count; j++) {
            var le = chk.eq(j).attr('level');
            if (chk.eq(num).prop("checked")) {

                if (le > level_bottom){
                    chk.eq(j).prop("checked", true);
                }
                else if (le == level_bottom){
                    break;
                }
            } else {
                if (le >level_bottom){
                    chk.eq(j).prop("checked", false);
                }else if(le == level_bottom){
                    break;
                }
            }
        }
    }
//area坐标转换

	$('#map area').each(function(){
		var coords=$(this).attr('data');
		coords=coords.split(',')
		for (i=0;i<coords.length;i=i+2){
			<!-- $(this).attr('coords',coords[i]*$('#monitor_map').width()); -->
			<!-- console.log($(this).attr('coords')); -->
			coords[i]=Math.floor(coords[i]*$('#monitor_map').width());
			<!-- console.log(coords[i]); -->
		}
		for (i=1;i<coords.length;i=i+2){
			<!-- $(this).attr('coords',coords[i]*$('#monitor_map').height()); -->
			<!-- console.log(coords[i]); -->
			coords[i]=Math.floor(coords[i]*$('#monitor_map').height());
			<!-- console.log(coords[i]); -->
		}
		$(this).attr('coords',coords);
		<!-- console.log($(this).attr('coords')); -->
	});
	<!-- console.log($('#map area').attr('coords')); -->
		<!-- console.log($('#monitor_map').width()); -->
    //返回首页
    function backIndex(){
        window.location.href = '/public/index.php/admin/main/index/';
    }
		
	    function zoommark(){

    }
    function zoomout(){
         var myImg = document.getElementById("monitor_map");
        
         var cruWidth = myImg.clientWidth;
         // alert(cruWidth);
        var cruHeight = myImg.clientHeight;
         //alert(cruWidth);   // 
          myImg.style.width = (cruWidth * 1.5) +"px";
           myImg.style.height = (cruHeight  * 1.5) +"px";
          //alert(cruHeight);
    }
    function zoommin(){
     var myImg = document.getElementById("monitor_map");
        var cruWidth = myImg.clientWidth;
        var cruHeight = myImg.clientHeight;
        if(myImg.style.width == 500+"px"){
            alert("缩小到最小范围");
        }else{
             myImg.style.width = (cruWidth / 1.5) +"px";
            myImg.style.height = (cruHeight / 1.5) +"px";
        }
    }
    function zoomZero(){
        
        var myImg = document.getElementById("monitor_map");
        var srcImg = document.getElementById('monitor_map').getAttribute("src");
        var srcc = "__STATIC__/images/gs.jpg";
        //更换图片
        document.getElementById('monitor_map').src=srcc;
    }
    
   

    Wind.css('dragula');
    Wind.use('masonry', 'imagesloaded', 'dragula', function () {
        var $homeGrid = $('.home-grid').masonry({
            // set itemSelector so .grid-sizer is not used in layout
            itemSelector: '.grid-item',
            // use element for option
            columnWidth: '.grid-sizer',
            percentPosition: true,
            horizontalOrder: false,
            transitionDuration: 0
        });

        $homeGrid.masonry('on', 'layoutComplete', function (event, laidOutItems) {
        });


        $homeGrid.masonry();

        var containers = [];
        $('.home-grid .grid-item').each(function () {
            containers.push(this);
        });
        dragula(containers, {
            isContainer: function (el) {
                return false; // only elements in drake.containers will be taken into account
            },
            moves: function (el, source, handle, sibling) {
                return true; // elements are always draggable by default
            },
            accepts: function (el, target, source, sibling) {
                return true; // elements can be dropped in any of the `containers` by default
            },
            invalid: function (el, handle) {
                return false; // don't prevent any drags from initiating by default
            },
            direction: 'vertical',             // Y axis is considered when determining where an element would be dropped
            copy: false,                       // elements are moved by default, not copied
            copySortSource: false,             // elements in copy-source containers can be reordered
            revertOnSpill: false,              // spilling will put the element back where it was dragged from, if this is true
            removeOnSpill: false,              // spilling will `.remove` the element, if this is true
            mirrorContainer: document.body,    // set the element that gets mirror elements appended
            ignoreInputTextSelection: true     // allows users to select input text, see details below
        }).on('drop', function (el, target, source, sibling) {
            var $target          = $(target);
            var targetClasses    = $target.attr('class');
            var targetDataWidget = $target.data('widget');
            var targetDataSystem = $target.data('system');
            var $source          = $(source);
            var sourceClasses    = $source.attr('class');
            var sourceDataWidget = $source.data('widget');
            var sourceDataSystem = $source.data('system');
            $(source).append($(target).find('.dashboard-box').not('.gu-transit'));
            $(target).append(el);
            $target.attr('class', sourceClasses);
            $target.data('widget', sourceDataWidget);
            $target.data('system', sourceDataSystem);

            $source.attr('class', targetClasses);
            $source.data('widget', targetDataWidget);
            $source.data('system', targetDataSystem);
            $homeGrid.masonry();

            _widgetSort();
        }).on('shadow', function (el, container, source) {
            $homeGrid.masonry();
        });
    });

    function _widgetSort() {
        var widgets = [];
        $('.home-grid .grid-item').each(function () {
            var $this = $(this);

            widgets.push({
                name: $this.data('widget'),
                is_system: $this.data('system')
            });
        });

        $.ajax({
            url: "{:url('main/dashboardWidget')}",
            type: 'post',
            dataType: 'json',
            data: {widgets: widgets},
            success: function (data) {

            },
            error: function () {

            },
            complete: function () {
            }
        });
    }

    //获取官方通知
    $.getJSON("http://www.thinkcmf.com/service/sms_jsonp.php?lang={$lang_set}&v={$thinkcmf_version}&callback=?",
        function (data) {
            var tpl      = '<li><em class="title"></em><span class="content"></span></li>';
            var $notices = $("#thinkcmf-notices");
            $notices.empty();
            if (data.length > 0) {
                $('#thinkcmf-notices-grid').show();
                $.each(data, function (i, n) {
                    var $tpl = $(tpl);
                    $(".title", $tpl).html(n.title);
                    $(".content", $tpl).html(n.content);
                    $notices.append($tpl);
                });
            } else {
                $notices.append("<li>^_^,{:lang('NO_NOTICE')}~~</li>");
            }
        });

    Wind.css('dragula');
    Wind.use('masonry', 'imagesloaded', 'dragula', function () {
        var $homeGrid = $('.home-grid').masonry({
            // set itemSelector so .grid-sizer is not used in layout
            itemSelector: '.grid-item',
            // use element for option
            columnWidth: '.grid-sizer',
            percentPosition: true,
            horizontalOrder: false,
            transitionDuration: 0
        });

        $homeGrid.masonry('on', 'layoutComplete', function (event, laidOutItems) {
        });


        $homeGrid.masonry();

        var containers = [];
        $('.home-grid .grid-item').each(function () {
            containers.push(this);
        });
        dragula(containers, {
            isContainer: function (el) {
                return false; // only elements in drake.containers will be taken into account
            },
            moves: function (el, source, handle, sibling) {
                return true; // elements are always draggable by default
            },
            accepts: function (el, target, source, sibling) {
                return true; // elements can be dropped in any of the `containers` by default
            },
            invalid: function (el, handle) {
                return false; // don't prevent any drags from initiating by default
            },
            direction: 'vertical',             // Y axis is considered when determining where an element would be dropped
            copy: false,                       // elements are moved by default, not copied
            copySortSource: false,             // elements in copy-source containers can be reordered
            revertOnSpill: false,              // spilling will put the element back where it was dragged from, if this is true
            removeOnSpill: false,              // spilling will `.remove` the element, if this is true
            mirrorContainer: document.body,    // set the element that gets mirror elements appended
            ignoreInputTextSelection: true     // allows users to select input text, see details below
        }).on('drop', function (el, target, source, sibling) {
            var $target          = $(target);
            var targetClasses    = $target.attr('class');
            var targetDataWidget = $target.data('widget');
            var targetDataSystem = $target.data('system');
            var $source          = $(source);
            var sourceClasses    = $source.attr('class');
            var sourceDataWidget = $source.data('widget');
            var sourceDataSystem = $source.data('system');
            $(source).append($(target).find('.dashboard-box').not('.gu-transit'));
            $(target).append(el);
            $target.attr('class', sourceClasses);
            $target.data('widget', sourceDataWidget);
            $target.data('system', sourceDataSystem);

            $source.attr('class', targetClasses);
            $source.data('widget', targetDataWidget);
            $source.data('system', targetDataSystem);
            $homeGrid.masonry();

            _widgetSort();
        }).on('shadow', function (el, container, source) {
            $homeGrid.masonry();
        });


    });

    function _widgetSort() {

        var widgets = [];
        $('.home-grid .grid-item').each(function () {
            var $this = $(this);

            widgets.push({
                name: $this.data('widget'),
                is_system: $this.data('system')
            });
        });

        $.ajax({
            url: "{:url('main/dashboardWidget')}",
            type: 'post',
            dataType: 'json',
            data: {widgets: widgets},
            success: function (data) {

            },
            error: function () {

            },
            complete: function () {

            }
        });
    }

    //获取官方通知
    $.getJSON("http://www.thinkcmf.com/service/sms_jsonp.php?lang={$lang_set}&v={$thinkcmf_version}&callback=?",
        function (data) {
            var tpl      = '<li><em class="title"></em><span class="content"></span></li>';
            var $notices = $("#thinkcmf-notices");
            $notices.empty();
            if (data.length > 0) {
                $('#thinkcmf-notices-grid').show();
                $.each(data, function (i, n) {
                    var $tpl = $(tpl);
                    $(".title", $tpl).html(n.title);
                    $(".content", $tpl).html(n.content);
                    $notices.append($tpl);
                });
            } else {
                $notices.append("<li>^_^,{:lang('NO_NOTICE')}~~</li>");
            }
        });
</script>
<script src="__STATIC__/js/echarts/echarts.min.js"></script>

<script  type="text/javascript">
	//---------------------- 隐患状态环状图 ---------------------
	var myChart = echarts.init(document.getElementById('hidenStatusView'));
        option = {
                    tooltip: {
                        trigger: 'item',
                        formatter: "{a} <br/>{b}: {c} ({d}%)"
                    },
                     legend: {
				        //图例垂直排列
				        orient: 'vertical',
				        x: 'left',
				        show:true,
				        top:15,
				        left:15,
				        //data中的名字要与series-data中的列名对应，方可点击操控
				        data:['已上报','待整改','待复查','已完成']
				    },
                    color: ["#497EB5", "#CAD5F2", "#4C80B6"],  
                    graphic: {
                        type: 'text',
                        left: 'center',
                        top: 'center'
                    },
                     label: {
	                normal: {
	                    show: true,
	                    position: 'inside',
	                    formatter: '{d}%',//模板变量有 {a}、{b}、{c}、{d}，分别表示系列名，数据名，数据值，百分比。{d}数据会根据value值计算百分比

	                   textStyle : {                   
	                    align : 'center',
	                    baseline : 'middle',
	                    fontFamily : '宋体',
	                    fontSize : 15,
	                    fontWeight : 'bolder'
	                 }
	                },
	            },
	            
                    series: [
                        {
                            name: '隐患状态',
                            type: 'pie',
                            radius: ['45%', '70%'],//改变图标的大小
                            itemStyle: {
                                normal: {
                                    label: {
                                        show: true,
                                        textStyle: { color: '#000', fontSize: "16" },
                                        formatter: function (val) {
                                            //让series 中的文字进行换行
                                            return val.name.split("-").join("\n");
                                        }
                                    },
                                    title: {
                                        text: ''
                                    },
                                    labelLine: {
                                        show: true,
                                        lineStyle: { color: '#3c4858' }
                                    }
                                },
                                emphasis: {
                                    shadowBlur: 10,
                                    shadowOffsetX: 0,
                                    shadowColor: 'rgba(0, 0, 0, 0.5)',
                                    textColor: '#000'
                                }
                            },
                            //data: revArr_plcoleday
                            data: [
                                { value: 335, name: '已上报' },
                                { value: 310, name: '待整改' },
                                { value: 234, name: '待复查' },
                                { value: 234, name: '已完成' }
                            ]
                        }
                    ],
                };
                myChart.setOption(option);
	//---------------------- 隐患整改率环状图 ---------------------
	var myChart = echarts.init(document.getElementById('reformView'));
		option = {
	    //提示框组件,鼠标移动上去显示的提示内容
	    tooltip: {
	       trigger: 'item',
	       formatter: "{a} <br/>{b}: {c} ({d}%)"//模板变量有 {a}、{b}、{c}、{d}，分别表示系列名，数据名，数据值，百分比。
	    },
	    color: ["#E5CBA7","#EDDDC6","#B27B4B","#98693B"],  
	    //图例
	    legend: {
	        //图例垂直排列
	        orient: 'vertical',
	        x: 'left',
	        show:true,
	        top:15,
	        left:15,
	        //data中的名字要与series-data中的列名对应，方可点击操控
	        data:['熔炼一车间','熔炼二车间','办公室','设备部']
	    },
	    series: [
	        {
	            name:'隐患整改率',
	            type:'pie',
	            //饼状图
	           // radius: ['50%', '70%'],
	            avoidLabelOverlap: false,
	            //标签
	            label: {
	                normal: {
	                    show: true,
	                    position: 'inside',
	                    formatter: '{d}%',//模板变量有 {a}、{b}、{c}、{d}，分别表示系列名，数据名，数据值，百分比。{d}数据会根据value值计算百分比

	                   textStyle : {                   
	                    align : 'center',
	                    baseline : 'middle',
	                    fontFamily : '宋体',
	                    fontSize : 15,
	                    fontWeight : 'bolder'
	                 }
	                },
	            },
	            data:[
	                {value:335, name:'熔炼一车间'},
	                {value:310, name:'熔炼二车间'},
	                {value:234, name:'办公室'},
	                {value:135, name:'设备部'}
	            ]
	        }
	    ]
	};
        myChart.setOption(option);
	//---------------------- 各部门风险未巡查次数周统计 折线图-------
	var myChart = echarts.init(document.getElementById('unpartolView'));
		var xAxisData = [];
		var data1 = [];
		var data2 = [];
		for (var i = 1; i < 31; i++) {
		    xAxisData.push(i + '号');
		    data1.push((Math.sin(i / 5) * (i / 5 -10) + i / 6) * 5);
		    data2.push((Math.cos(i / 5) * (i / 5 -10) + i / 6) * 5);
		}
		option = {
		    legend: {
		        data: ['熔炼一车间', '熔炼二车间','办公室','设备部'],
		        align: 'left',
		        top:30
		    },
		    toolbox: {
		        // y: 'bottom',
		        feature: {
		            magicType: {
		                type: ['stack', 'tiled']
		            },
		            dataView: {},
		            saveAsImage: {
		                pixelRatio: 2
		            }
		        }
		    },
		    tooltip: {},
		    xAxis: {
		        data: xAxisData,
		        silent: false,
		        splitLine: {
		            show: false
		        }
		    },
		    yAxis: {
		    },
		    grid: {
                //改变图表的大小
                left: '5%',
                right: '8%',
                bottom: '2%',
                containLabel: true
            },
		    series: [{
		        name: '熔炼一车间',
		        type: 'bar',
		        data: data1,
		        animationDelay: function (idx) {
		            return idx * 10;
		        }
		    }, {
		        name: '熔炼二车间',
		        type: 'bar',
		        data: data2,
		        animationDelay: function (idx) {
		            return idx * 10 + 100;
		        }
		    }, {
		        name: '办公室',
		        type: 'bar',
		        data: data2,
		        animationDelay: function (idx) {
		            return idx * 10 + 100;
		        }
		    }, {
		        name: '设备部',
		        type: 'bar',
		        data: data2,
		        animationDelay: function (idx) {
		            return idx * 10 + 100;
		        }
		    }],
		    animationEasing: 'elasticOut',
		    animationDelayUpdate: function (idx) {
		        return idx * 5;
		    }
		};
		myChart.setOption(option);		
	//---------------------- 各部门隐患数量周统计 柱状图---------------------	
	var myChart = echarts.init(document.getElementById('hidenView'));
		option = {
		    tooltip: {
		        trigger: 'axis',
		        axisPointer: {
		            type: 'cross',
		            crossStyle: {
		                color: '#999'
		            }
		        }
		    },
		    toolbox: {
		        feature: {
		            dataView: {show: true, readOnly: false},
		            magicType: {show: true, type: ['line', 'bar']},
		            restore: {show: true},
		            saveAsImage: {show: true}
		        }
		    },
		    legend: {
		    	 align: 'left',
		        top:30,
		        data:['熔炼一车间','熔炼二车间','办公室']
		    },
		    grid: {
                //改变图表的大小
                left: '5%',
                right: '8%',
                bottom: '2%',
                containLabel: true
            },
		    xAxis: [
		        {
		            type: 'category',
		            data: ['星期一','星期二','星期三','星期四','星期五','星期六','星期天'],
		            axisPointer: {
		                type: 'shadow'
		            }
		        }
		    ],
		    yAxis: [
		        {
		            type: 'value',
		            min: 0,
		            max: 250,
		            interval: 50,
		            axisLabel: {
		                formatter: '{value}'
		            }
		        },
		        {
		            type: 'value',
		            name: '次数',
		            min: 0,
		            max: 25,
		            interval: 5,
		            axisLabel: {
		                formatter: '{value}'
		            }
		        }
		    ],
		    series: [
		        {
		            name:'熔炼一车间',
		            type:'bar',
		            data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
		        },
		        {
		            name:'熔炼二车间',
		            type:'bar',
		            data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
		        },
		        {
		            name:'办公室',
		            type:'line',
		            yAxisIndex: 1,
		            data:[2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
		        }
		        ,
		        {
		            name:'设备部',
		            type:'line',
		            yAxisIndex: 1,
		            data:[2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
		        }
		    ]
		};

	myChart.setOption(option);	
	//---------------------- 隐患排查方式统计 柱状图---------------------	
	var myChart = echarts.init(document.getElementById('hidenTypeView'));	
	  option = {
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                        }
                    },
                    legend: {
                        show: false,
                        data: ['综合检查', '专项检查', '季节检查', '日常检查', '巡查检查','上级部门检查','节假日及重大活动检查']
                    },
                    grid: {
                        //改变图表的位置打下
                        left: '5%',
                        right: '8%',
                        bottom: '2%',
                        containLabel: true
                    },
                    yAxis: {
                        type: 'value',
                        name: "",
                        axisLabel: {
                            color: '#fff',
                            fontSize: '16',
                        },
                    },
                    xAxis: {
                        type: 'category',
                        axisLabel: {
                            color: '#fff',
                            fontSize: '16',
                        },
                        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
                    },
                    series: [
                        {
                            name: '综合检查',
                            type: 'bar',
                            stack: '总量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                            //data: data_1
                        },
                        {
                            name: '专项检查',
                            type: 'bar',
                            stack: '总量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                        },
                        {
                            name: '日常检查',
                            type: 'bar',
                            stack: '总量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                            //data: data_5
                        },
                        {
                            name: '巡查检查',
                            type: 'bar',
                            stack: '总量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                        },
                        {
                            name: '上级部门检查',
                            type: 'bar',
                            stack: '总量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                        }
                        ,
                        {
                            name: '节假日及重大活动检查',
                            type: 'bar',
                            stack: '总量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                        }
                        ,
                        {
                            name: '洗精煤',
                            type: 'bar',
                            stack: '总量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                        }
                    ]
                };
                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);		
    //---------------------- 各部门隐患上报周统计 折线图---------------------	
    var myChart = echarts.init(document.getElementById('hidensendView'));
    	option = {
	            tooltip: {
	                trigger: 'axis',
	                axisPointer: {
	                    type: 'cross',
	                    label: {
	                        backgroundColor: '#6a7985'
	                    }
	                }
	            },
	            legend: {
	                data: ['熔炼一车间', '熔炼二车间','办公室','设备部'],
	                right: '5',
	                top:'40',
	                show:false
	            },
	            toolbox: {
	                feature: {
	                    saveAsImage: {}
	                }
	            },
	            grid: {
	                //改变图表的位置打下
	                left: '5%',
	                right: '8%',
	                bottom: '5%',
	                containLabel: true
	            },
	            xAxis: [
	                {
	                    type: 'category',
	                    axisLabel: {
	                        color: '#000',
	                        fontSize: '16',
	                    },
	                    boundaryGap: false,
	                    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
	                }
	            ],
	            yAxis: [
	                {
	                    type: 'value',
	                    axisLabel: {
	                        color: '#000',
	                        fontSize: '16',
	                    },
	                }
	            ],
	            series: [
	                {
	                    name: '熔炼一车间',
	                    type: 'line',
	                    stack: '总量',
	                    areaStyle: { normal: {} },
	                    data: [320, 332, 301, 334, 390, 330, 320]
	                },
	                {
	                    name: '熔炼二车间',
	                    type: 'line',
	                    stack: '总量',
	                    label: {
	                        normal: {
	                            show: true,
	                            position: 'top'
	                        }
	                    },
	                    areaStyle: { normal: {} },
	                    data: [520, 532, 501, 434, 390, 330, 420]
	                },
	                {
	                    name: '办公室',
	                    type: 'line',
	                    stack: '总量',
	                    label: {
	                        normal: {
	                            show: true,
	                            position: 'top'
	                        }
	                    },
	                    areaStyle: { normal: {} },
	                    data: [320, 432, 501, 434, 690, 230, 120]
	                },
	                {
	                    name: '设备部',
	                    type: 'line',
	                    stack: '总量',
	                    label: {
	                        normal: {
	                            show: true,
	                            position: 'top'
	                        }
	                    },
	                    areaStyle: { normal: {} },
	                    data: [120, 232, 301, 234, 490, 530, 320]
	                }
	            ]
	        };
	myChart.setOption(option);		
</script>	
	
<hook name="admin_before_body_end"/>
</body>
</html>